<template>
    <div class="app-container">



        <el-form @submit.native.prevent :model="queryParams" ref="queryForm" :inline="true" v-show="showSearch">
            <el-form-item label="档案名称" prop="title">
                <el-input v-model="queryParams.title" placeholder="请输入档案名称" clearable style="width: 240px"
                    @keyup.enter.native="handleQuery" />
            </el-form-item>
            <el-form-item label="档案门类" prop="categoryId">
                <treeselect v-model="queryParams.categoryId" :options="deptOptions" :disable-branch-nodes="true" label
                    placeholder="请选择档案门类" noOptionsText="暂无数据" :normalizer="normalizerCategoryID"
                    :style="isStyle ? 'line-height: 32px;font-size:12px' : 'line-height: 36px;font-size:14px'"
                    style="width: 240px;" />
            </el-form-item>
            <el-form-item label="介 质" prop="medium">
                <el-select v-model="queryParams.medium" placeholder="请选择" @keyup.enter.native="handleQuery">
                    <el-option v-for="(i, idx) in dict.type.JZ" :key="idx" :label="i.label" :value="i.value">
                    </el-option>
                </el-select>
            </el-form-item>
            <el-form-item label="接收时间" prop="dateTime">
                <el-date-picker v-model="dateTime" type="daterange" range-separator="至" start-placeholder="开始日期"
                    end-placeholder="结束日期" format="yyyy-MM-dd" value-format="yyyyMMdd">
                </el-date-picker>
            </el-form-item>
            <el-form-item label="移交单位" prop="transferUnit">
                <treeselect v-model="queryParams.transferUnit" :options="optionSelect" :disable-branch-nodes="true" label
                    placeholder="请选择档案门类" noOptionsText="暂无数据" :normalizer="normalizerCategoryID"
                    :style="isStyle ? 'line-height: 32px;font-size:12px' : 'line-height: 36px;font-size:14px'"
                    style="width: 240px;" />
            </el-form-item>
            <el-form-item label="移交人" prop="userName">
                <el-input v-model="queryParams.userName" placeholder="请输入档案名称" clearable style="width: 240px"
                    @keyup.enter.native="handleQuery" />
            </el-form-item>
            <el-form-item>
                <el-button type="primary" icon="el-icon-search" @click="handleQuery">搜索</el-button>
                <el-button icon="el-icon-refresh" @click="resetQuery">重置</el-button>
            </el-form-item>
        </el-form>
        <el-row :gutter="10" class="mb8" ref="refbut">
            <el-col :span="1.5">
                <el-button type="primary" plain icon="el-icon-plus" @click="handledeitTap(0)">新增</el-button>
            </el-col>
            <el-col :span="1.5">
                <el-button type="primary" plain icon="el-icon-edit" @click="handledeitTap(1)">修改</el-button>
            </el-col>
            <el-col :span="1.5">
                <el-button type="primary" plain icon="el-icon-delete" @click="handleDelete()">删除</el-button>
            </el-col>
            <el-col :span="1.5">
                <el-button type="primary" plain icon="el-icon-download" @click="handleExport()">导出</el-button>
            </el-col>
            <el-col :span="1.5">
                <el-button type="primary" plain icon="el-icon-plus" @click="handleprintTap()">打印登记单</el-button>
            </el-col>
        </el-row>

        <el-table v-loading="loading" border :height="tableHeight" :data="list" @selection-change="handleSelectionChange">
            <el-table-column type="selection" width="55" align="center" />
            <el-table-column label="序号" type="index" />
            <el-table-column label="档案名称" prop="title" :show-overflow-tooltip="true" />
            <el-table-column label="移交单位" prop="transferName" :show-overflow-tooltip="true" />
            <el-table-column label="移交人" prop="userName" :show-overflow-tooltip="true" />
            <el-table-column label="档案门类" prop="categoryName" :show-overflow-tooltip="true" />
            <el-table-column label="介质" prop="medium" :show-overflow-tooltip="true" >
                <template slot-scope="scope">
                    <span v-for="(i, idx) in dict.type.JZ" :key="idx">
                        {{ scope.row.medium == i.value ? i.label : '' }}
                    </span>

            </template>
            </el-table-column>
            <el-table-column label="条目数目" prop="entriesNum" :show-overflow-tooltip="true" />
            <el-table-column label="接收时间" prop="receptionTime" :show-overflow-tooltip="true" />
            <el-table-column label="操作数目" prop="operationsNum" :show-overflow-tooltip="true" />
            <el-table-column label="备注" prop="notes" :show-overflow-tooltip="true" />
        </el-table>

        <pagination v-show="total > 0" :total="total" :page.sync="queryParams.pageNum" :limit.sync="queryParams.pageSize"
            @pagination="getList" />

        <deitOpen v-if="isDeitOpen" :isDeitOpen="isDeitOpen" @closeDelDialog="closeDelDialog" @submitForm="submitForm"
            :rowIds="rowIds"></deitOpen>
        <print v-if="isprintOpen" :isprintOpen="isprintOpen" @closeDelDialog="closeDelDialog" :ids="ids"></print>
    </div>
</template>

<script>

import { archiveEnrolllist, archiveEnrollDelete } from "@/api/archive/digitalizeReceive/archiveLoginRecord.js"
import { listGROUPTree } from "@/api/archive/archivalAppraisal/openness/openArchivesAppraisal"//档案门类树
import estimateTableHeight from '@/mixins/estimateTableHeight'//vue项目中element-tabel自动计算高度
import Treeselect from "@riophae/vue-treeselect";
import "@riophae/vue-treeselect/dist/vue-treeselect.css";
import { deptTreeNoDateScope } from "@/api/system/user";
import deitOpen from "@/views/archive/digitalizeReceive/archiveLoginRecord/deit.vue"
import print from "@/views/archive/digitalizeReceive/archiveLoginRecord/print.vue"

export default {
    name: "Role",
    archive_Dicts: ['JZ'],
    mixins: [estimateTableHeight], // 混入方法
    components: {
        Treeselect, deitOpen, print
    },
    data() {
        return {
            // 遮罩层
            loading: true,
            // 选中数组
            ids: [],
            // 非单个禁用
            single: true,
            // 非多个禁用
            multiple: true,
            // 显示搜索条件
            showSearch: true,
            // 总条数
            total: 0,
            // 列表表格数据
            list: [],
            // 弹出层标题
            title: "",

            // 查询参数
            queryParams: {
                pageNum: 1,
                pageSize: 10,
                title: undefined,
                categoryId: undefined,
                medium: undefined,
                transferUnit: undefined,
                userName: undefined,
                receptionTime: undefined,
                edReceptionTime: undefined,
            },

            isDeitOpen: false,
            isprintOpen: false,
            superviseRow: "",
            deptOptions: [],
            optionSelect: [],
            isStyle: true,
            rowIds: [],
            dateTime: undefined

        };
    },
    created() {
        if (this.$store.getters.size == 'small') {

            this.isStyle = true

        } else {

            this.isStyle = false
        }
        this.getList();
        this.getDeptSelect();
        this.deptTreeSelectPost();
        // console.log(this.dict.type.sys_normal_disable)
    },
    methods: {
        // 只能选择数据下面有children 的数据，没有children的时候禁用
        normalizer(node) {
            if (node.children == null || node.children == undefined || !node.children.length) {
                delete node.children;
            }
            return node
        },
        // 只能选择数据下面有children 的数据，没有children的时候禁用
        normalizerCategoryID(node) {
            if (node.nodeType == 'fonds') {
                if (node.children == undefined || node.children == null || !node.children.length) {

                    node['isDisabled'] = true;
                }
            }
            if (node.children == null || node.children == undefined || !node.children.length) {
                delete node.children;
            }
            return node
        },
        /** 档案门类列表*/
        getDeptSelect(valNew) {
            listGROUPTree().then(response => {
                this.deptOptions = response.data
            });
        },
        //部门（单选）
        deptTreeSelectPost() {
            deptTreeNoDateScope({ tenantCode: this.tenantCode }).then(response => {
                this.optionSelect = response.data;
            })
        },
        //添加修改
        handledeitTap(val) {
            if (val == 0) { //新增
                this.isDeitOpen = true;
                this.rowIds = undefined;
            } else { //修改
                if (!this.single) {
                    this.isDeitOpen = true;
                    this.rowIds = this.ids;
                } else {
                    this.$modal.msgWarning("请选择一条数据进行修改哦~")
                }
            }

        },
        //添加成功
        submitForm() {
            this.isDeitOpen = false;
            this.getList();
        },



        /** 删除按钮操作 */
        handleDelete(row) {
            const ids = this.ids;
            if (!this.multiple) {

                this.$modal.confirm('是否确认删除当前数据项？').then(function () {
                    return archiveEnrollDelete(ids);
                }).then(() => {
                    this.getList();
                    this.$modal.msgSuccess("删除成功");
                }).catch(() => { });
            } else {
                this.$modal.msgWarning("请选择要删除的数据哦~")
            }
        },
        /** 导出按钮操作 */
        handleExport() {
            this.download('archive/archiveEnroll/export', {
                ...this.queryParams
            }, `dangandengjijilu_${new Date().getTime()}.xlsx`)
        },
        /** 查询立档单位列表 */
        getList() {
            this.loading = true;
            archiveEnrolllist(this.queryParams).then(response => {
                if (response.code = "200") {
                    this.list = response.rows;
                    this.total = response.total;
                    this.loading = false;
                }
            }
            );
        },

        /** 搜索按钮操作 */
        handleQuery() {
            this.queryParams.pageNum = 1;
            console.log(this.dateTime)
            if (this.dateTime != undefined) {
                this.queryParams.receptionTime = this.dateTime[0];
                this.queryParams.edReceptionTime = this.dateTime[1];
            }
            this.getList();
        },
        /** 重置按钮操作 */
        resetQuery() {
            this.resetForm("queryForm");
            this.dateTime = undefined;
            this.queryParams.receptionTime = undefined;
            this.queryParams.edReceptionTime = undefined
            this.handleQuery();
        },
        // 多选框选中数据
        handleSelectionChange(selection) {
            this.ids = selection.map(item => item.id)
            this.single = selection.length != 1
            this.multiple = !selection.length
        },
        //查看详情
        handleDetails(row) {
            var that = this;
            that.isDetailsOpen = true
        },

        //关闭查看
        closeDelDialog() {
            var that = this;
            that.isDeitOpen = false;
            this.isprintOpen = false;
        },
        //查看打印详情
        handleprintTap() {
            var that = this;
            if (!this.single) {
                that.isprintOpen = true;
            } else {
                this.$modal.msgWarning("请选择一条数据哦~")
            }


        }


    }
};
</script>
<style lang="scss" scoped></style>
